<template>
	<view class="empty-box" :style="emptyStyle">
		<image style="width: 410rpx;height: 186rpx;" src="../../../static/mine/empty.png" mode=""></image>
		<text class="tips">{{tips}}</text>
	</view>
</template>
<script>
	export default {
		name: "empty-box",
		props: {
			marginTop: {
				type: Number,
				default: 50
			},
			tips:{
				type:String,
				default:'暂无宠物'
			}
		},
		data() {
			return {

			};
		},
		computed: {
			emptyStyle() {
				return `
					margin-top:${this.marginTop*2}rpx;
				`
			}
		},
		mounted() {

		},

	}
</script>
<style scoped lang="scss">
	.empty-box {
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: center;

		.tips {
			color: rgba(0, 0, 0, 0.40);
			text-align: center;
			font-family: "PingFang SC";
			font-size: 28rpx;
			font-weight: 400;
			margin-top: 40rpx;
		}
	}
</style>